<template>
  <section class="services-area">
    <div class="container">
      <div class="services-bg">
        <div class="row">
          <div class="col-lg-3 col-md-6 col-sm-6">
            <div class="services-item mt-50">
              <img src="/assets/images/services-1.png" alt="services">
              <!--<div class="icon">
                <i class="flaticon-under-construction"></i>
              </div>-->
              <div class="services-overlay">
                <h4 class="title">資治通鑒</h4>
                <p>《资治通鉴》，是由北宋史学家司马光主编的一部多卷本编年体史书。</p>
                <nuxt-link to="/single-service">瞭解更多</nuxt-link>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-md-6 col-sm-6">
            <div class="services-item mt-50">
              <img src="/assets/images/services-2.png" alt="services">
             <!--<div class="icon">
                <i class="flaticon-industry"></i>
              </div>--> 
              <div class="services-overlay">
                <h4 class="title">史記</h4>
                <p>《史记》，二十四史之一，是西汉史学家司马迁撰写的纪传体史书。</p>
                <nuxt-link to="/single-service">瞭解更多</nuxt-link>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-md-6 col-sm-6">
            <div class="services-item mt-50">
              <img src="/assets/images/services-3.png" alt="services">
              <!--<div class="icon">
                <i class="flaticon-layout"></i>
              </div>-->
              <div class="services-overlay">
                <h4 class="title">左傳</h4>
                <p>《左传》,旧传为春秋时期左丘明著，是中国古代一部叙事完备的编年体史书.</p>
                <nuxt-link to="/single-service-3">瞭解更多</nuxt-link>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-md-6 col-sm-6">
            <div class="services-item mt-50">
              <img src="/assets/images/services-4.png" alt="services">
              <!--<div class="icon">
                <i class="flaticon-under-construction-1"></i>
              </div>-->
              <div class="services-overlay">
                <h4 class="title">三國志</h4>
                <p>《三国志》，二十四史之一，是由西晋史学家陈寿所著。</p>
                <nuxt-link to="/single-service">瞭解更多</nuxt-link>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="services-shape">
      <img src="/assets/images/shape/shape-7.png" alt="">
    </div>
  </section>
</template>

<script>
    export default {
        name: "ServiceArea"
    }
</script>

<style scoped>

</style>
